import { Col, Row } from "antd";
import { useEffect } from "react";
import { useDispatch, useSelector } from "react-redux";
import { useParams } from "react-router-dom";
import { product_id } from "../../store/actions/product.action";
import Layout from "./Layout";
import ProductionItem from "./ProductionItem";
function Product() {
    const { productId } = useParams()
    const productState = useSelector(state => state.productReducer)
    const dispatch = useDispatch()
    useEffect(() => {
        dispatch(product_id({ productId }))
        // eslint-disable-next-line
    }, [productId])
    return (
        <Layout title='商品名称' subTile='商品描述'>
            <Row>
                <Col span='18'>
                    {Object.keys(productState).length > 0 && <ProductionItem imgStyle={{ width: '50%', margin: 'a auto' }} product={productState} showCart={false} showView={false} />}
                </Col>
                <Col span='6'>left</Col>
            </Row>
        </Layout>
    )
}
export default Product